import React from 'react';
import ReactDOM from 'react-dom';
import store from './store'
console.log(store)
class App extends React.Component {
  f1 = () => {
    store.dispatch({ type: "changeName", nnn: "珠峰培训" })
    console.log(store.getState())
  }
  f2 = () => {
    store.dispatch({ type: "changeAge", aaa: 999 })
    console.log(store.getState())
  }
  f3 = () => {
    store.dispatch({ type: "changeSex", sss: 888 })
    console.log(store.getState())
  }
  f4 = () => {
    store.dispatch({ type: "changeColor", ccc: "blue" })
    console.log(store.getState())
  }
  componentDidMount() {
    store.subscribe(() => {
      // 每当redux中的数据更新之后会自动执行 subscribe 传进去的所有的回调函数
      this.setState({})
    })
  }
  render() {
    let state = store.getState()
    console.log(state)
    return <div className=''>
      <h1>{JSON.stringify(state)}</h1>
      <button onClick={this.f1}>name</button>
      <button onClick={this.f2}>age</button>
      <button onClick={this.f3}>sex</button>
      <button onClick={this.f4}>color</button>
    </div>;
  }
}

ReactDOM.render(<App />, document.getElementById('root'))